window.onload=function(){
    var oClock=document.getElementById('num');
    var oSecond=document.getElementById('sp');
    var oMinute=document.getElementById('mp');
    var oHour=document.getElementById('hp');
    var timer=null;
    var Second=null;
    var Minute=null;
    var Hour=null;
    var du=null;
    function getTime (){
       var oDate=new Date();
        Hour=oDate.getHours();
        Minute=oDate.getMinutes();
        Second=oDate.getSeconds();
        du = Hour*3600+Minute*60+Second;
        if(Hour<10){
            Hour="0"+Hour;
        }
        if(Minute<10){
            Minute="0"+Hour;
        }
        if(Second<10){
            Second="0"+Second;
        }
        oClock.textContent=Hour+":"+Minute+":"+Second; 
    }
    getTime();
    oSecond.style.animationDelay="-"+du+'s';
    oMinute.style.animationDelay='-'+du+'s';
    oHour.style.animationDelay="-"+du+'s';
    timer=setInterval(getTime,1000);
}